<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript" src="js/jquery-1.4.2.js" charset="utf-8"></script>
<script type="text/javascript" src="js/FreshBooks2.1.js" charset="utf-8"></script>
<script type="text/javascript" src="js/FreshBooksTS.js" charset="utf-8"></script>
<script>

	var start=null;
	var pauseTime=null;
	var timeout;
	
	function load(){
		var running = false;

		populateClients();		
		
		if (localStorage.getItem("com.yogs.chrome.freshbooks.client")!=null &&
				localStorage.getItem("com.yogs.chrome.freshbooks.client")!=""){
			$("#Clients").val(localStorage.getItem("com.yogs.chrome.freshbooks.client"));
		}

		if (localStorage.getItem("com.yogs.chrome.freshbooks.project")!=null &&
				localStorage.getItem("com.yogs.chrome.freshbooks.project")!=""){
			$("#Projects").val(localStorage.getItem("com.yogs.chrome.freshbooks.project"));
		}

		if (localStorage.getItem("com.yogs.chrome.freshbooks.task")!=null &&
				localStorage.getItem("com.yogs.chrome.freshbooks.task")!=""){
			$("#Tasks").val(localStorage.getItem("com.yogs.chrome.freshbooks.task"));
		}

		if (localStorage.getItem("com.yogs.chrome.freshbooks.running")!=null &&
				localStorage.getItem("com.yogs.chrome.freshbooks.running")!=""){
			running = localStorage.getItem("com.yogs.chrome.freshbooks.running");
		}

		//Did they pause
		if (localStorage.getItem("com.yogs.chrome.freshbooks.pause")!=null && 
				localStorage.getItem("com.yogs.chrome.freshbooks.pause")!=""){
			start = new Date(parseInt(localStorage.getItem("com.yogs.chrome.freshbooks.start")));
			pauseTime = new Date(parseInt(localStorage.getItem("com.yogs.chrome.freshbooks.pause")));

			var timeBeforePause = (pauseTime.getTime() - start.getTime());
			var now = new Date();
			start = new Date((now.getTime() - timeBeforePause));
			pauseTime = now;

			refresh(); 

			//Stop the user changing the selected project while timer is running
			disableProjectsAndTasks();
			setStatus("status_1", "Timer is paused", true, 6000);
		}
		else if (localStorage.getItem("com.yogs.chrome.freshbooks.start")!=null &&
				localStorage.getItem("com.yogs.chrome.freshbooks.start")!=""){
			start = new Date(parseInt(localStorage.getItem("com.yogs.chrome.freshbooks.start")));
			refresh(); 			
			if (running){
				//Stop the user changing the selected project while timer is running
				disableProjectsAndTasks();
				timeout=setInterval ( "refresh();", 250 );
			}					
		}

	}

	function setRecordProject(){
		localStorage.setItem("com.yogs.chrome.freshbooks.client", $("#Clients").val());
		localStorage.setItem("com.yogs.chrome.freshbooks.project", $("#Projects").val());
		localStorage.setItem("com.yogs.chrome.freshbooks.task", $("#Tasks").val());

		var running = false;
		if (localStorage.getItem("com.yogs.chrome.freshbooks.running")!=null &&
				localStorage.getItem("com.yogs.chrome.freshbooks.running")!=""){
			running = localStorage.getItem("com.yogs.chrome.freshbooks.running");
		}

		if (running){
			setStatus("status_1", "Already Running. Reset or Submit before restarting.");
		} else {
			if (pauseTime == null){
				start = new Date();
				bgpage.start = start;
				localStorage.setItem("com.yogs.chrome.freshbooks.start", start.getTime());
				
			} else {
				var timeBeforePause = (pauseTime.getTime() - start.getTime());
				var now = new Date();
				start = new Date(now.getTime() - timeBeforePause);
				localStorage.setItem("com.yogs.chrome.freshbooks.start", start.getTime());
				bgpage.start = start;
				
				pauseTime = null;
				localStorage.removeItem("com.yogs.chrome.freshbooks.pause");
			}
	
			refresh(); 		
			bgpage.refresh();
				
			timeout=setInterval ( "refresh();", 250 );
			localStorage.setItem("com.yogs.chrome.freshbooks.running",true);
			//Stop the user changing the selected project while timer is running
			disableProjectsAndTasks();
	
			chrome.browserAction.setTitle({title:String("Recording: " + $("#Projects option:selected").text() + $("#Tasks option:selected").text())});
		}
		
	}


	function pause(){
		var running = false;
		if (localStorage.getItem("com.yogs.chrome.freshbooks.running")!=null &&
				localStorage.getItem("com.yogs.chrome.freshbooks.running")!=""){
			running = localStorage.getItem("com.yogs.chrome.freshbooks.running");
		}

				
		if (running && null == pauseTime){
			clearInterval(timeout);
			pauseTime = new Date();
			bgpage.pause();
			localStorage.removeItem("com.yogs.chrome.freshbooks.running");
			localStorage.setItem("com.yogs.chrome.freshbooks.pause", pauseTime.getTime());
		} else {
			setStatus("status_1", "Not set, either not recording or already paused");			
		}
	}

	
	function reset(){
		/*
		var running = false;
		if (localStorage.getItem("com.yogs.chrome.freshbooks.running")!=null &&
				localStorage.getItem("com.yogs.chrome.freshbooks.running")!=""){
			running = localStorage.getItem("com.yogs.chrome.freshbooks.running");
		}
		if (running && confirm("Do you really want to clear your recorded time?")){
		*/
		start = null;
		pauseTime = null;
		clearInterval(timeout);

		bgpage.reset();
		
		localStorage.removeItem("com.yogs.chrome.freshbooks.client");
		localStorage.removeItem("com.yogs.chrome.freshbooks.project");
		localStorage.removeItem("com.yogs.chrome.freshbooks.task");
		localStorage.removeItem("com.yogs.chrome.freshbooks.start");
		localStorage.removeItem("com.yogs.chrome.freshbooks.pause");
		localStorage.removeItem("com.yogs.chrome.freshbooks.running");
		document.getElementById('timer_1').innerHTML = "00:00:00";
		enableProjectsAndTasks();

		chrome.browserAction.setTitle({title:String(com.freshbooks.api.UA)});
		chrome.browserAction.setBadgeText({text:String("")});
		
	}
	
	function refresh(){
		var now = new Date();
		
		//addition of 500ms displays chosen time before starting to record
		var elapsed = (now.getTime() - start.getTime() + 500);
		var tSecs = parseInt(elapsed/1000);
		var tMins = parseInt(tSecs/60);
		var secs = tSecs % 60;
		var tHrs = parseInt(tMins/60);
		var mins = tMins % 60;
		
		if(secs < 10)
			secs = "0" + secs;
		if(mins < 10)
			mins = "0" + mins;
		if(tHrs < 10)
			tHrs = "0" + tHrs;
		
		var display = (tHrs+":"+mins + ":" + secs);
		document.getElementById('timer_1').innerHTML = display;

		if (localStorage.getItem("com.yogs.chrome.freshbooks.auto_stop") != null &&
				localStorage.getItem("com.yogs.chrome.freshbooks.auto_stop") != ""){
			autoStop = localStorage.getItem("com.yogs.chrome.freshbooks.auto_stop");

			//If the user has set an auto-stop then pause the timer when its reached.
			if (Number(elapsed/3600000) >= Number(autoStop)){
				pause();
			}		
		}
		
	}

	function submitCurrentTime()
	{	
		var now = new Date();
		var running = false;

		if (localStorage.getItem("com.yogs.chrome.freshbooks.running")!=null &&
				localStorage.getItem("com.yogs.chrome.freshbooks.running")!=""){
			running = localStorage.getItem("com.yogs.chrome.freshbooks.running");
		}

		if (!running && null== pauseTime){
			setStatus("status_1", "Nothing to submit, not recording");
			return;
		}

		var elapsedMS = (now.getTime() - start.getTime());
	    // Read time; we must log in (fractional) hours.
		// 3600 seconds per hour, 1000 milliseconds per second
		var loggedTime = getRoundedHours( (elapsedMS / 60000 ));

		submitHours(loggedTime);
	
		// Don't count while we're submitting
		pause();
	}
	
</script>
<style>
*{
	margin:0px;
	padding:0px;
}
body {
	color: #3b5686;
	background-color: white;
	width: 735px;
}
#main{
	height:40px;
	display:block;
	}
p{
	display:inline-block;
	text-align:center;
}
img{
	border:medium none;
	float:left;
	margin:0 0 -2px 14px;
}
#title p:last-child{
	border-right:none;
}
p.time{
	width:70px;
}
p.client{
	width:165px;
	border:none;
}
p.project{
	width:165px;
	border:none;
}
p.task{
	width:165px;
	border:none;
}
p.run{
	width:40px;
}
p.reset{
	width:40px;
}
p.pause{
	width:40px;	
}
p.submit{
	width:40px;	
}
input.i{
	margin-left:4px;
	margin-right:-2px;
	width:24px;
}
.timer{
	border-bottom:1px solid #0075CE;
}
.button{
	cursor:pointer;
}
.select{
	width:165px;
	border:none;
}

#unfocus{
	position:absolute;
	z-index:-100;
	opacity:0;
}
#hidden{
	position:absolute;
	overflow:hidden;
	height:0px;
	top:0px;
	z-index:-100;
}
#title{
	-webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -webkit-border-bottom-left-radius: 0px;
    -webkit-border-bottom-right-radius: 0px;
	background:#0075CE url(down_bgr.png) repeat-x top;
	height:12px;
	color:#fff;
	width:733px;
	padding:1px;
	display:block;
	
}
#title p{
	font-family:Arial, Helvetica, sans-serif;
	border-right:1px solid #fff;
	margin-top:-2px;
	font-size:12px;
}
#footer{
	-webkit-border-top-left-radius: 0px;
    -webkit-border-top-right-radius: 0px;
    -webkit-border-bottom-left-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
	background:#0075CE url(down_bgr.png) repeat-x bottom;
	height:12px;
	color:#fff;
	width:100%;
	padding:1px;
	display:block;	
}
#footer p{
	font-family:Arial, Helvetica, sans-serif;
	border-right:1px solid #fff;
	margin-top:-2px;
	font-size:12px;
}
p.status{
	width:100%;
}

</style>
</head>
<body onLoad="load();">
<div id="main">
    <div id="title">
    <p class="time">timer</p><p class="client">client</p><p class="project">project</p><p class="task">task</><p class="run">run</p><p class="pause">pause</p><p class="reset">reset</p><p class="submit">submit</p>
    </div>
    <div class="timer" id="s1">
    	<p id="timer_1" class="time">00:00:00</p><p class="client"><select id="Clients" class="select" onchange="setProjectsFromClient(event)"><option value="-1">Clients</option></select></p><p class="project"><select id="Projects" class="select" onchange="setTasksFromProject(event)"><option value="-1">Projects</option></select></p><p class="task"><select id="Tasks" class="select"><option value="-1">Tasks</option></select></p><p class="run"><img class="button" src="run.png" onClick="setRecordProject();"></p><p class="pause"><img class="button" src="pause.png" onClick="pause();"></p><p class="reset"><img class="button" src="reset.png" onClick="reset();"></p><p><img id="submit" class="button" src="submit.png" onClick="submitCurrentTime();"></p>
    </div>
    <div id="hidden">
	<input on id="unfocus" value=""/>
	</div>
    <div id="footer"><p id="status_1" class="status"></p></div>
</div>


</body>
</html>